<template>
  <view class="bg-white">
    <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y"
                 @scrolltolower="lower" >
      <!--    社区论坛-->
      <uni-section :title="item.title" class="" type="line" v-for="item in  forumList">
        <uni-card :cover="item.thumImg" @click="onClick">
          <!-- <image slot='cover' style="width: 100%;" :src="cover"></image> -->
          <text class="uni-body">{{item.content}}</text>
          <view slot="actions"
                class="card-actions flex align-center justify-end padding-bottom-sm padding-top-sm solid-top">
            <view class="card-actions-item flex align-center margin-right-sm" @click="onLoveClick()">
              <uni-icons type="heart" size="18" color="#999"></uni-icons>
              <text class="card-actions-item-text">点赞</text>
            </view>
            <view class="card-actions-item flex align-center " @click="actionsClick(item.id)">
              <uni-icons type="chatbubble" size="18" color="#999"></uni-icons>
              <text class="card-actions-item-text">评论</text>
            </view>
          </view>
        </uni-card>
      </uni-section>
      <uni-fab ref="fab"  horizontal="right" vertical="bottom" @fabClick="fabClick" />
      <view class="cu-tabbar-height margin-top"></view>

    </scroll-view>
  </view>
</template>

<script>
import {baseUrl} from "../../config";
import {getForumList} from "../../api/flower/forum";

export default {
  name: "index",
  data() {
    return {
      cover: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
      scrollTop: 0,
      forumList:[]
    }
  },
  //生命周期函数
  mounted() {
    this.findList();
    //从下一个页面跳回到这个页面的时候，需要刷新，怎么做到
    // uni.$on('refresh',()=>{
    //   this.findList();
    // })
  },
  //onload周期函数
  onShow() {
    console.log("onShow")
    //console.log("onload周期函数");
    //console.log(this.forumList);
    this.findList();
  },
  methods: {
    findList(){
      let that = this;
      //查询所有帖子
      getForumList({
        page: 1,
        pageSize: 100
      }).then(res => {
        console.log(res);
        //console.log(res.data);
        that.forumList = res.rows;
        //baseUrl
        //thum_img 前面拼接baseUrl
        //简化写法
        for(let i = 0;i<that.forumList.length;i++){
          that.forumList[i].thumImg = baseUrl + that.forumList[i].thumImg;
        }
      })

    },
    onClick(e) {
      console.log(e)
    },
    //点赞按钮的触发事件
    onLoveClick(){
      console.log("点击了 发布论坛 publishForum");
      //弹出点赞了的提示框
      uni.showToast({
        title: '点赞成功',
        icon: 'none'
      })

    },
    actionsClick(id) {

      //id存本地
      uni.setStorageSync('forumId',id);

      uni.navigateTo({
        url: '/pages/forum/forumDetail'
      })

    },
    lower: function(e) {
      console.log(e)
    },
    fabClick(){
      console.log("点击了 发布论坛 publishForum");

      uni.navigateTo({
        url: '/pages/forum/publishForum'
      })

    }

  },

}
</script>

<style lang="less" scoped>
.scroll-Y {
  height: calc(100vh - 45px);
}

</style>